<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>编辑文章</title>
    <link rel="stylesheet" href="${basePath}/front/css/editorAtrtical.css">
    <link rel="icon" href="${basePath}/front/images/Tomorrow03.png" sizes="32x32">

</head>
<body>
   <!-- 顶部导航栏开始 -->
    <div class="header">
        <div class="inner">
            <div class="logo">
                <!-- 点击后回到首页 -->
                <a href="/frontIndex" id="boke"><img src="${basePath}/front/images/Tomorrow01.png" alt=""></a>
            </div>
            <div class="nav">
                <ul>
                    <li><a href="/user/userCenter/${user.userId}"><i></i>${user.userName}</a></li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 顶部导航栏结束 -->
    <!-- 编辑器部分开始 -->
    <div class="editor">
        <form action="/article/front/addArticle" method="post" id="addArticleForm" onsubmit="return false;" >
            <div class="title">
                <input type="text" id="title" name="articleTitle" placeholder="点此输入文章标题" maxlength="20">
                <label for="">文章分类</label>
                <select name="categoryId" id="" class="acticalType" >
                    <c:forEach items="${categorys}" var="category">
                        <option value="${category.categoryId}">${category.categoryName}</option>
                    </c:forEach>
                </select>
            </div>
            <div class="editorT">
                <div id="editor1" class="textNav"></div>
                <div id="editor2" class="textArea"></div>
                <input type="hidden" id="editor3" value="" name="articleContent">
                <input type="hidden" name="userId" value="${sessionScope.user.userId}">
                <input type="submit" value="确定" id="yes">
                <input type="button" value="取消" id="no">
            </div>
        </form>
    </div>
    <!-- 编辑器部分结束 -->
    <script src="${basePath}/front/js/wangEditor.min.js"></script>
    <script src="${basePath}/front/js/editorAtical.js"></script>
   <script src="${basePath}/front/js/jquery-1.9.1.min.js"></script>

    <script type="text/javascript">
        $(function () {
            $('#addArticleForm').submit(function () {
                var postData = $("#addArticleForm").serialize(); //序列化表单，后台可正常通过post方法获取数据
//                console.log(postData)
                $.ajax({
                    type: "POST",
                    url: "/article/front/addArticle",
                    data: postData,
                    success: function(data) {
                        if (data.success) {
                            alert('提交成功');
                            window.location.href = '${basePath}/user/userCenter/${sessionScope.user.userId}';
                        } else {
                            alert("出错");
                        }
                    }
                });

            });

        });




    </script>

<script type="text/javascript">
    var E = window.wangEditor
    var editor = new E('#editor1','#editor2')
    // 或者 var editor = new E( document.getElementById('editor') )
    editor.create()
    var strArtical = null;
    document.getElementById("yes").addEventListener('click',function () {
        strArtical = editor.txt.text();
        console.log(strArtical);
        $("#editor3").attr("value",strArtical);
    },false);
//    document.getElementById("editor3").value = strArtical;

</script>


</body>
</html>